import React, { useEffect } from 'react'

const Home = (props) => {
  useLogginLife('Home')
  return <h2>Home</h2>
}

const Profile = (props) => {
  useLogginLife('Profile')
  return <h2>Profile</h2>
}

export default function CustomLifeHookDemo01() {
  useLogginLife('CustomLifeHookDemo01')

  return (
    <div>
      <h2>CustomLifeHookDemo01</h2>
      <Home/>
      <Profile/>
    </div>
  )
}

function useLogginLife(name) {
  useEffect(() => {
    console.log(`${name} Component Create`)

    return () => {
      console.log(`${name} Component destory`)
    }
  }, [])
}
